<!--
@name:auditDialog
@author:Zhenglei
@date:9:21
@description:auditDialog
@update:2022/5/179:21
-->
<template>
  <div>
    <el-dialog :visible.sync="visible"
               title="处方审核"
               width="70%"
               :before-close="modalClose"
               :close-on-click-modal="false"
               :close-on-press-escape="false">
      <el-form :model="submitData"
               label-position="right"
               label-width="180px"
               ref="formModelRef"
               :rules='formModelRules'>
        <el-row>
          <el-col :span="12">
            <el-form-item label="管理对象：">
              <p>{{ prescriptionData.chronicImgPrescriptionDto.userName }}</p>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="上传时间：">
              <p>{{ formatterDate(prescriptionData.chronicImgPrescriptionDto.uploadTime) }}</p>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="处方内容：">
          <el-image :src="prescriptionData.chronicImgPrescriptionDto.imgUrl" style="width: 160px;height: 160px" :preview-src-list="[prescriptionData.chronicImgPrescriptionDto.imgUrl]"/>
        </el-form-item>

        <el-form-item>
          <div class="div-western">
            <p class="tv-title">{{ prescriptionData.doctorDto.hospitalName }}处方笺</p>
            <div class="div-info">
              <p style="font-size: 18px">科室：{{ prescriptionData.doctorDto.departmentName }}</p>
              <p>{{formatterDate1(prescriptionData.expireTime)}}前有效</p>
            </div>

            <div class="div-info" style="border-bottom: none">
              <p>姓名：{{ prescriptionData.memberDto.name }}</p>
              <p>性别：{{ prescriptionData.memberDto.sex === 1 ? '男' : '女' }}</p>
              <p>年龄：{{ getAge(prescriptionData.memberDto.age) }}</p>
            </div>

            <div style="width: 100%" v-if="prescriptionData.prescriptionType!==4">
              <p>过敏史：{{ prescriptionData.allergies }}</p>
            </div>


            <div style="width: 100%;margin-top: 20px;margin-bottom: 20px">
              <p>临床诊断：{{ prescriptionData.diagnosticResult }}</p>
            </div>
            <!--            远程处方-->
            <div style="width: 100%;margin-top: 20px;margin-bottom: 20px" v-if="prescriptionData.prescriptionType===4">
              <p>设备信息：{{ prescriptionData.detailList[0].drugName }}</p>
            </div>


            <div class="div-line"/>

            <p class="tv-title" style="width: 100%;margin-top: 20px">Rp：</p>

            <div class="div-durg-list" v-if="prescriptionData.prescriptionType!==4">
              <div class="div-durg-item" v-for="(item,index) in prescriptionData.detailList" :key="index">
                <div class="div-durg-info">
                  <p>{{ item.drugName }}</p>
                  <p v-if="prescriptionData.prescriptionType===2">{{ item.standard }}</p>
                  <p>{{ item.dosageNum }}{{ item.unit }}</p>
                </div>
                <div class="div-durg-info" v-if="prescriptionData.prescriptionType===2">
                  <p>{{ item.usages }}</p>
                </div>
              </div>
            </div>
            <!--            远程处方-->
            <div class="div-durg-list" v-if="prescriptionData.prescriptionType===4">
              <div class="div-durg-info">
                <p>监测天数</p>
                <p>{{ prescriptionData.detailList[0].number }}天</p>
              </div>
              <div class="div-durg-info">
                <p>每天次数</p>
                <p>{{ prescriptionData.detailList[0].dayNum }}次</p>
              </div>
            </div>

            <div class="div-line" style="transform: rotate(170deg);margin-top: 40px"/>


            <!--            中药备注-->
            <div class="div-durg-list" style="margin-top: 50px" v-if="prescriptionData.prescriptionType===1">
              <div class="div-durg-item" v-for="(item,index) in prescriptionData.detailList" :key="index">
                <p>{{ item.drugName }}：{{ item.remark }}</p>
              </div>
            </div>
            <div style="margin-top: 60px;margin-bottom: 20px;width: 100%" v-if="prescriptionData.prescriptionType!==4">
              <p>医嘱：{{ prescriptionData.medicalAdvice }}</p>
            </div>
            <!--            远程处方-->
            <div style="margin-top: 60px;margin-bottom: 20px;width: 100%" v-if="prescriptionData.prescriptionType===4">
              <p>补充说明：{{ prescriptionData.detailList[0].remark }}</p>
            </div>

            <div class="div-line"/>

            <!--            中药用法-->
            <div v-if="prescriptionData.prescriptionType===1"
                 style="width: 100%;height: auto;border-bottom: 1px solid #9ea0a2;display: flex;flex-direction: column;padding-bottom: 20px;padding-top: 20px">
              <p>共{{ JSON.parse(prescriptionData.detailList[0].usagesData).dosageUnit }}{{ prescriptionData.detailList[0].numberUnit }}</p>
              <p>{{ prescriptionData.detailList[0].usages }}</p>
            </div>

            <div style="display: flex;flex-direction: row;width: 100%;margin-top: 30px">
              <p>医师：{{ prescriptionData.doctorDto.nickName }}</p>
            </div>

            <p style="width: 100%;margin-top: 20px">开方时间：{{ formatterDate(prescriptionData.openTime) }}</p>
          </div>


        </el-form-item>
        <el-form-item label="审核结果：" prop="status">
          <el-radio-group v-model="submitData.status" :disabled="!dataObj.isEdit">
            <el-radio :label="5">通过</el-radio>
            <el-radio :label="-1">不通过</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="不通过原因：" prop="returnReason" v-if="submitData.status===-1" >
          <el-input v-model="submitData.returnReason" class="w-300" clearable placeholder="请输入拒绝原因" :disabled="!dataObj.isEdit"
                    type="textarea"></el-input>
        </el-form-item>
      </el-form>
      <p align="center">
        <el-button @click="modalClose"
                   type="info">取 消
        </el-button>
        <el-button type="primary"
                   v-prevent-re-click
                   v-if="dataObj.isEdit"
                   @click="handleSave">提 交
        </el-button>
      </p>

    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "auditDialog",
  props: {
    dataObj: {
      type: Object,
      default: {}
    },
    visible: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      submitData: {
        id: null,
        status: '',
        returnReason: '',
      },
      prescriptionData: {
        doctorDto: {},
        memberDto: {},
        chronicImgPrescriptionDto: {},
      },
      formModelRules: {
        status: [{required: true, message: '请选择审核结果'}],
        returnReason: [{required: true, message: '请输入拒绝原因'}],
      }
    }
  },
  created() {
    this.submitData.id=this.dataObj.id
    this.getNewPrescriptionDetail()
  },
  methods: {
    modalClose() {
      this.$emit('update:visible', false); // 直接修改父组件的属性
    },
    //查询处方详情
    getNewPrescriptionDetail() {
      this.post(this.api.slowDisease.getNewPrescriptionDetail, {
        id: this.dataObj.id
      }).then((res) => {
        if (res.data.code === '200') {
          this.prescriptionData = res.data.object
          if (!this.dataObj.isEdit){
            this.submitData.status=this.prescriptionData.status
            this.submitData.returnReason=this.prescriptionData.returnReason
          }
          this.getAge(this.prescriptionData.memberDto.age)
        }
      })
    },
    getAge(birth) {
      let birthdays = new Date(birth);
      let d = new Date();
      let age =
        d.getFullYear() -
        birthdays.getFullYear() -
        (d.getMonth() < birthdays.getMonth() ||
        (d.getMonth() == birthdays.getMonth() &&
          d.getDate() < birthdays.getDate())
          ? 1
          : 0);
      return age
    },
    handleSave(){
      this.$refs.formModelRef.validate(valid=>{
        if (valid){
          this.post(this.api.slowDisease.auditPrescripiton,this.submitData).then((res) => {
            if (res.data.code === '200') {
              this.$message.success('审核成功')
              this.$parent.getList()
              this.modalClose()
            }
          })
        }
      })
    },
    // 时间转换
    formatterDate(time) {
      if (time)
        return this.commonFunction.timestampFormat(new Date(time), 'yyyy-MM-dd hh:mm')
      else
        return ''
    },
    // 时间转换
    formatterDate1(time) {
      if (time)
        return this.commonFunction.timestampFormat(new Date(time), 'yyyy-MM-dd')
      else
        return ''
    },
  },
}
</script>

<style scoped>
.div-western {
  width: 500px;
  background: #f4f5f7;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.27),0 0 60px rgba(0,0,0,0.1) inset
}

.tv-title {
  font-weight: bold;
  color: #222;
  font-size: 26px;
}

.div-info {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  height: 60px;
  justify-content: space-between;
  border-bottom: 1px solid #9ea0a2;
}

.div-line {
  width: 100%;
  height: 1px;
  background: #9ea0a2;
}

.div-durg-list {
  margin-top: 30px;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.div-durg-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 28px;
  width: 100%;
}

.div-durg-info {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
</style>
